<template>
    <div class="dev-width">
        <div class="searchbox">
            <ul id="ul_menus">
                <li v-for="(item,index) in codesClone" :key="index">
                    <a :class="item.selected?'active':''" @click="codeChange(item)">{{item.name}}</a>
                </li>
            </ul>
            <div class="search_area">
                <p style="display: block">
                    <input type="text" v-model.trim="keyword" @keyup.enter="btnSearch" class="search_input" placeholder="请输入关键字搜索" />
                    <a @click="btnSearch" class="button_search">
                        <i class="iconfont icon-index_seatch"></i>搜索</a>
                </p>
            </div>
        </div>
        <ul class="location">
            <li>
                <a href="/">
                    <i class="iconfont icon-zhuye"></i>
                    <span>首页</span>
                </a>
            </li>
            <li>&gt;</li>
            <li>
                <a>搜索结果</a>
            </li>
            <li>&gt;</li>
            <li>
                <ul class="loaction-tip">
                    <li>
                        <a>{{selectedCategory.name}} </a>
                    </li>
                    <template v-if="selectedCategory.code=='01'">
                        <li @click="closePatentType" v-if="selectPatentType!=null">
                            <a>{{selectPatentType.name}}
                                <i class="iconfont icon-guanbi">
                                </i>
                            </a>
                        </li>
                        <li @click="closePatentHighLeves" v-if="selectedPatentHighLevel.length!=0" v-for="(item,index) in selectedPatentHighLevel" :key="index">
                            <a>{{item.value}}
                                <i class="iconfont icon-guanbi">
                                </i>
                            </a>
                        </li>
                    </template>
                    <template v-if="selectedCategory.code=='02'">
                        <li @click="closeTechHighLeve1s" v-if="selectedtechHighLevel1!=null">
                            <a>{{selectedtechHighLevel1.value}}
                                <i class="iconfont icon-guanbi">
                                </i>
                            </a>
                        </li>
                        <li @click="closeTechHighLeve2s(index)" v-if="selectedtechHighLevel2.length!=0" v-for="(item,index) in selectedtechHighLevel2" :key="index">
                            <a>{{item.value}}
                                <i class="iconfont icon-guanbi">
                                </i>
                            </a>
                        </li>
                    </template>
                    <template v-if="selectedCategory.code=='03'">
                        <li @click="closeDemandType" v-if="selectedDemandType!=null">
                            <a>{{selectedDemandType.name}}
                                <i class="iconfont icon-guanbi">
                                </i>
                            </a>
                        </li>
                        <li @click="closeDemandHightech(index)" v-if="selectDemandHighTechs.length!=0" v-for="(item,index) in selectDemandHighTechs" :key="index">
                            <a>{{item.value}}
                                <i class="iconfont icon-guanbi">
                                </i>
                            </a>
                        </li>
                    </template>
                </ul>
            </li>
            <li>
                <a v-if="keyword!=''"> “{{keyword}}” &gt;</a>
            </li>
            <li>共
                <b>{{totals}}</b>个结果</li>
        </ul>
        <div class="classify-box" v-if="selectedCategory.code=='01'">
            <div class="classify-row" v-if="patentTypeVisble">
                <label>专利分类</label>
                <ul>
                    <li v-for="(item,index) in selectedCategory.childs" :key="index">
                        <a @click="patentTypeChange(item)">{{item.name}}</a>
                    </li>
                </ul>
            </div>
            <div class="classify-row" v-if="!patentTypeVisble && selectPatentType.name!='外观设计'">
                <label>高新技术领域一级目录</label>
                <ul>
                    <li v-for="(item,index) in patentHighTechs" :key="index">
                        <a @click="patentHighTechsChange(item)">{{item.value}}</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="classify-box" v-if="selectedCategory.code=='02'">
            <div class="classify-row" v-if="techHighLevel1Visible">
                <label>高新技术领域一级目录</label>
                <ul>
                    <li v-for="(item,index) in techHighLevel1s" style="margin:0 14px 0 0" :key="index">
                        <a @click="techHighLeve1sChange(item)">{{item.value}}</a>
                    </li>
                </ul>
            </div>
            <div class="classify-row" v-else>
                <label>高新技术领域二级目录</label>
                <ul>
                    <li v-for="(item,index) in techHighLevel2s" :key="index">
                        <a @click="techHighLeve2sChange(item)">{{item.value}}</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="classify-box" v-if="selectedCategory.code=='03'">
            <div class="classify-row" v-if="demandTypeVisble">
                <label>需求分类</label>
                <ul>
                    <li v-for="(item,index) in selectedCategory.childs" :key="index">
                        <a @click="demandTypeChange(item)">{{item.name}}</a>
                    </li>
                </ul>
            </div>
            <div class="classify-row" v-else>
                <label>高新技术领域一级目录</label>
                <ul>
                    <li v-for="(item,index) in demandHighTechs" :key="index">
                        <a @click="demandHighTechsChange(item)">{{item.value}}</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="list-con">
            <div class="list-main">
                <div class="list-header">
                    <ul>
                        <li :class="selectOrder==0?'active':''" @click="orderBy('BY_HITS','DESC',0)">综合
                            <i class="iconfont"></i>
                        </li>
                        <li v-if="selectedCategory.code!='04'" :class="selectOrder==1?'active':''">
                            <span v-if="!showPriceArray" @click="orderBy('BY_PRICE','ASC',1)">价格
                                <i class="iconfont icon-zhcc_xiangxiajiantou"></i>
                            </span>
                            <span v-else @click="orderBy('BY_PRICE','DESC',1)">价格
                                <i class="iconfont icon-zhcc_xiangshangjiantou"></i>
                            </span>
                        </li>
                        <li :class="selectOrder==2?'active':''">
                            <span v-if="!showPublishTimeArray" @click="orderBy('BY_PUBLISH_TIME','ASC',2)">发布时间
                                <i class="iconfont icon-zhcc_xiangxiajiantou"></i>
                            </span>
                            <span v-else @click="orderBy('BY_PUBLISH_TIME','DESC',2)">发布时间
                                <i class="iconfont icon-zhcc_xiangshangjiantou"></i>
                            </span>
                        </li>
                    </ul>
                    <div class="list-page" v-if="totals>0">
                        <simplePager :current="page" :total="totals" :rows="rows" @change="change">
                        </simplePager>
                    </div>
                </div>
                <div class="list-box" v-if="totals>0" v-for="(item,index) in result" :key="index">
                    <nuxt-link class="list-img" v-if="item.category=='goods'" :to="{path:'/goods',query:{id:item.id}}">
                        <template v-if="!item.hasOwnProperty('url')">
                            <img v-if="item.goodsType=='01'" src="~/assets/images/zhuanli.png">
                            <img v-else src="~/assets/images/tech.png">
                        </template>
                        <img v-else :src="absUrl(item.url)" :onerror="defaultImg(item.goodsType)">
                    </nuxt-link>
                    <nuxt-link class="list-img" v-if="item.category=='demand'" :to="{path:'/demand',query:{id:item.id}}">
                        <img v-if="!item.hasOwnProperty('url')" src="~/assets/images/demand.png" />
                        <img v-else :src="absUrl(item.url)" :onerror="defaultImg('03')" />
                    </nuxt-link>
                    <nuxt-link class="list-img" v-if="item.category=='information'" :to="{path:`/news/${item.id}`}">
                        <img v-if="!item.hasOwnProperty('url')" src="~/assets/images/no-img.png" />
                        <img v-else :src="absUrl(item.url)" :onerror="defaultImg('04')" />
                    </nuxt-link>
                    <div class="list-txt " v-if="item.category=='goods' ">
                        <nuxt-link :to="{path: '/goods',query:{id:item.id}} ">
                            <h3 v-html="item.name "></h3>
                        </nuxt-link>
                        <div class="list-msg ">
                            <h4>专利号（申请号）：{{item.applyNo}}</h4>
                            <span>{{item.hits}}人浏览</span>
                            <span>{{item.publishTime|formatDate('yyyy-MM-dd')}}</span>
                        </div>
                        <ul class="list-tip ">
                            <li v-if="item.hasOwnProperty('emergingNames') ">
                                <label>高新技术领域</label>
                                <span v-html="getEmergingNames(item)">
                                </span>
                            </li>
                            <li v-if="item.hasOwnProperty('ipcName') ">
                                <label>IPC分类</label>{{item.ipcName}}</li>
                            <li>
                                <label>专利类型</label>{{filterChildType(item.childType)}}</li>
                            <li v-if="item.tags!=null ">
                                <label>商品标签</label>{{filterTags(item.tags)}}</li>
                        </ul>
                    </div>
                    <div class="list-txt " v-if="item.category=='demand' ">
                        <nuxt-link :to="{path: '/demand',query:{id:item.id}} ">
                            <h3 v-html="item.name "></h3>
                        </nuxt-link>
                        <div class="list-msg ">
                            <div class="list-type " v-for="(item,index) of filterType(item.type) " :key="index ">
                                <span v-if="item=='00' " class="list-orange " :key="index ">专利</span>
                                <span v-else class="list-blue ">技术成果</span>
                            </div>
                            <span>{{item.hits}}人浏览</span>
                            <span>{{item.inquiries}}人咨询</span>
                            <span>{{item.publishTime|formatDate('yyyy-MM-dd')}}</span>
                        </div>
                        <ul class="list-tip ">
                            <li v-if="item.hasOwnProperty('emergingName') ">
                                <label>高新技术领域</label>
                                <span v-html="getEmergingName(item)"></span>
                            </li>
                            <li v-if="item.tags!=null ">
                                <label>需求标签</label>{{filterTags(item.tags)}}</li>
                        </ul>
                    </div>
                    <div class="list-txt " v-if="item.category=='information' ">
                        <nuxt-link :to="{path:`/news/${item.id}`}">
                            <h3 v-html="item.name "></h3>
                        </nuxt-link>
                        <div class="list-msg ">
                            <span>{{item.hits}}人浏览</span>
                            <span>{{item.publishTime|formatDate('yyyy-MM-dd')}}</span>
                        </div>
                        <ul class="list-tip ">
                            <li v-if="item.hasOwnProperty('categoryName')">{{item.categoryName}}</li>
                            <li v-if="item.hasOwnProperty('item.source')">
                                <label>来源</label>{{item.source}}</li>
                            <li v-if="item.hasOwnProperty('item.author')">
                                <label>作者</label>{{item.author}}</li>
                        </ul>
                    </div>
                    <span v-if="item.category!='information' ">
                        <i v-if="item.price!='0' ">¥ {{item.price|formatNumber }} 元</i>
                        <i v-else>
                            <span>意向采购价格</span>面议</i>
                    </span>

                </div>
                <div class="list-box" v-if="totals==0">
                    <div style="text-align:center;marign-top:10px">暂无数据</div>
                </div>
                <div class="center-page " v-if="totals>0">
                    <mypager :total="totals" :rows="rows" :current="page" @change="change"></mypager>
                </div>
            </div>
            <div class="list-side" v-if="showTop==0">
                <h3>热门商品推荐</h3>
                <div class="side-box" v-for="(item,index) in topGoods" :key="index">
                    <nuxt-link :to="{path:'/goods',query:{id:item.id}}">
                        <a class="side-img" v-if="item.hasOwnProperty('goodsFileDto')">
                            <img v-if="item.goodsFileDto[0].fileUrl=='' && item.type=='01'" src="~/assets/images/zhuanli.png" />
                            <img v-if="item.goodsFileDto[0].fileUrl=='' && item.type=='02'" src="~/assets/images/tech.png" />
                            <img v-else :src="absUrl(item.goodsFileDto[0].fileUrl)" :onerror="defaultImg(item.type)" />
                        </a>
                        <a class="side-img" v-else-if="item.type=='01'">
                            <img src="~/assets/images/zhuanli.png">
                        </a>
                        <a class="side-img" v-else-if="item.type=='02'">
                            <img src="~/assets/images/tech.png">
                        </a>
                    </nuxt-link>
                    <div class="side-price">
                        <span v-if="item.payMode==1">
                            面议
                        </span>
                        <span v-else>
                            ¥ {{item.price|formatNumber}}元
                        </span>
                    </div>
                    <nuxt-link :to="{path:'/goods',query:{id:item.id}}" class="side-title">{{item.name}}
                    </nuxt-link>
                </div>
            </div>
            <div class="list-side" v-else-if="showTop==1">
                <h3>热门需求推荐</h3>
                <div class="side-box" v-for="(item,index) in topDemands" :key="index">
                    <nuxt-link :to="{path:'/demand',query:{id:item.id}}">
                        <a class="side-img" v-if="item.hasOwnProperty('demandImageList')">
                            <img :src="absUrl(item.demandImageList[0].fileUrl)" :onerror="defaultImg('03')" />
                        </a>
                        <a class="side-img" v-else>
                            <img src="~/assets/images/demand.png" />
                        </a>
                    </nuxt-link>
                    <div class="side-price">
                        <span v-if="item.intendedPrice==0">
                            面议
                        </span>
                        <span v-else>
                            ¥ {{item.intendedPrice|formatNumber}}元
                        </span>
                    </div>
                    <nuxt-link :to="{path:'/demand',query:{id:item.id}}" class="side-title">{{item.name}}</nuxt-link>
                </div>
            </div>
            <div class="list-side" v-else>
                <h3>热门资讯推荐</h3>
                <div class="side-box" v-for="(item,index) in topNews" :key="index">
                    <nuxt-link :to="{path:`/news/${item.id}`}">
                        <a class="side-img">
                            <img :src="absUrl(item.thumbnail)" :onerror="defaultImg('04')" />
                        </a>
                    </nuxt-link>
                    <nuxt-link :to="{path:`/news/${item.id}`}" class="side-title">{{item.title}}
                    </nuxt-link>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import portal from "~/net/portal"
import mypager from "~/components/Mypager"
import simplePager from "~/components/SimplePager"
import { searchCodes } from "~/constant/SearchCodes"
import { absUrl } from "~/utils/tool"
import { highTech } from './index'
const defaultLength = 20
export default {
    name: "search",
    data() {
        return {
            keyword: "",
            codes: [],
            codesClone: [],
            selectedCategory: null,
            selectedPatent: null,

            patentTypeVisble: false,
            selectPatentType: null,  //选中的专利分类
            patentHighTechs: [],
            selectedPatentHighLevel: [],//专利高新技术一级目录

            techHighLevel1Visible: false,//技术成果一级目录可见性
            techHighLevel1s: highTech,//技术成果高新技术一级目录
            selectedtechHighLevel1: null,
            techHighLevel2s: [],//技术成果高新技术二级目录
            selectedtechHighLevel2: [],

            demandTypeVisble: false, //需求分类可见性
            selectedDemandType: null,//选中的需求类型
            demandHighTechs: [],//需求高新一级目录
            selectDemandHighTechs: [],

            result: [], //搜索结果
            topGoods: [], //热门商品
            topDemands: [], //热门需求
            topNews: [], //热门资讯
            limitLength: defaultLength, //IPC分类/高新技术默认展示的条数
            showPriceArray: false,
            showPublishTimeArray: false,
            totals: 0,
            page: 1,
            rows: 10,
            orderParam: null,
            showTop: 0,  //显示热门分类
            selectOrder: 0,
            absUrl: absUrl,
            _init: false
        }
    },
    components: {
        mypager,
        simplePager
    },
    created() {
        this.init();
        this.getParams();
    },
    methods: {
        init() {
            this.codes = searchCodes.map(c => {
                if (c.code == "") {
                    c.selected = true;
                    c.goodtypeSelected = true;
                } else {
                    c.selected = false;
                    c.goodtypeSelected = false;
                    c.childs.forEach(_ => {
                        _.selected = true;
                    });
                }
                return c;
            });
            Object.assign(this.codesClone, this.codes);
            this.codes = this.codes.slice(1, 3);
        },
        getParams() {
            // 默认数据 
            this._init = true
            if (Object.keys(this.$route.query).length == 0 || typeof this.$route.query.category == 'undefined') {
                this.checkOrder()
                this.codeChange(this.codesClone.find(_ => _.category == ''), false)
            } //url为search?keyword=&page=&rows=& ...
            else {
                if (typeof this.$route.query.page != 'undefined') {
                    this.page = parseInt(this.$route.query.page)
                }
                if (typeof this.$route.query.rows != 'undefined') {
                    this.rows = parseInt(this.$route.query.rows)
                }
                if (typeof this.$route.query.keyword != "undefined") {
                    this.keyword = this.$route.query.keyword
                }
                this.checkOrder()
                this.category = this.$route.query.category
                if (typeof this.$route.query.goodsType != "undefined") {
                    let item = this.codesClone.find(_ =>
                        _.category == this.$route.query.category
                        && _.code == this.$route.query.goodsType)
                    this.codeChange(item, false);
                }
                else {
                    let item = this.codesClone.find(_ =>
                        _.category == this.$route.query.category)
                    this.codeChange(item, false);
                }
            }
        },
        /**
         * trigger表示 用户触发还是加载时根据params触发
         */
        codeChange(item, trigger = true) {
            this.codesClone.forEach(_ => {
                _.selected = false;
            });
            item.selected = true;
            this.selectedCategory = item;
            if (this.selectedCategory.code == "01") {
                this.patentTypeVisble = true
            }
            else if (this.selectedCategory.code == "02") {
                this.techHighLevel1Visible = true
            }
            else if (this.selectedCategory.code == "03") {
                this.demandTypeVisble = true
            }
            if (trigger == true && this._init == false) {
                this.orderParam = null
                this.selectOrder = 0
                this.showPriceArray = false
                this.showPublishTimeArray = false
                this.page = 1
            }
            if ((trigger == false && this._init == true) || (trigger == true && this._init == false)) {
                this.search(this.getSearchParams(), this.orderParam);
            }
            this.getTopHit()
        },
        checkOrder() {
            if (typeof this.$route.query.orderBy != "undefined" && typeof this.$route.query.orderSeq != "undefined") {
                this.orderParam = {
                    orderBy: this.$route.query.orderBy,
                    orderSeq: this.$route.query.orderSeq
                }
                if (this.orderParam.orderBy == 'BY_PRICE') {
                    this.showPriceArray = this.$route.query.orderSeq == 'ASC' ? true : false
                    this.selectOrder = 1
                }
                if (this.orderParam.orderBy == 'BY_PUBLISH_TIME') {
                    this.showPublishTimeArray = this.$route.query.orderSeq == 'ASC' ? true : false
                    this.selectOrder = 2
                }
            }
        },
        getTopHit() {
            if (this.selectedCategory.code == "03") {
                this.showTop = 1;
                if (this.topDemands.length == 0) {
                    this.getTopDemandsByHits();
                }
            }
            else if (this.selectedCategory.code == "04") {
                this.showTop = 2;
                if (this.topNews.length == 0) {
                    this.getTopNewsByHits();
                }
            }
            else {
                this.showTop = 0;
                if (this.topGoods.length == 0) {
                    this.getTopGoodsByHits()
                }
            }
        },
        //专利UI操作
        patentTypeChange(item) {
            this.selectPatentType = item
            this.patentTypeVisble = false
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        closePatentType() {
            this.selectPatentType = null
            this.selectedPatentHighLevel = []
            this.patentTypeVisble = true
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        patentHighTechsChange(item) {
            if (!this.selectedPatentHighLevel.find(_ => _.key == item.key)) {
                this.selectedPatentHighLevel.push(item)
                this.page = 1;
                this.search(this.getSearchParams(), this.orderParam);
            }
        },
        closePatentHighLeves(index) {
            this.selectedPatentHighLevel.splice(index, 1);
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        //技术成果UI操作
        techHighLeve1sChange(item) {
            this.selectedtechHighLevel1 = item
            this.techHighLevel1Visible = false
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        closeTechHighLeve1s() {
            this.selectedtechHighLevel1 = null
            this.selectedtechHighLevel2 = []
            this.techHighLevel1Visible = true
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        techHighLeve2sChange(item) {
            if (!this.selectedtechHighLevel2.find(_ => _.key == item.key)) {
                this.selectedtechHighLevel2.push(item)
                this.page = 1;
                this.search(this.getSearchParams(), this.orderParam);
            }
        },
        closeTechHighLeve2s(index) {
            this.selectedtechHighLevel2.splice(index, 1);
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        //需求相关UI操作
        demandTypeChange(item) {
            this.selectedDemandType = item
            this.demandTypeVisble = false
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        closeDemandType() {
            this.selectedDemandType = null
            this.selectDemandHighTechs = []
            this.demandTypeVisble = true
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        demandHighTechsChange(item) {
            if (!this.selectDemandHighTechs.find(_ => _.key == item.key)) {
                this.selectDemandHighTechs.push(item)
                this.page = 1;
                this.search(this.getSearchParams(), this.orderParam);
            }
        },
        closeDemandHightech(index) {
            this.selectDemandHighTechs.splice(index, 1);
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        btnSearch() {
            if (this.keyword == "") {
                this.$Message.warning("请输入关键字搜索");
                return;
            }
            this.selectOrder = 0
            this.showPriceArray = false
            this.showPublishTimeArray = false
            this.orderParam = null
            this.page = 1;
            this.search(this.getSearchParams(), this.orderParam);
        },
        search(data, orderParam) {
            var param = { body: data }
            if (orderParam != null) {
                param = {
                    body: data,
                    query: orderParam
                }
            }
            this.$router.replace({
                path: '/search',
                query: Object.assign({}, data, orderParam)
            })
            portal.searchAll(param).then(res => {
                this.result = [];
                this._init = false;
                this.result = res.data.rows;
                this.totals = res.data.total;
                if (this.totals > 0) {
                    if (this.selectedCategory.code == "01") {
                        if (!this.patentTypeVisble && this.selectedPatentHighLevel.length == 0) {
                            this.patentHighTechs =
                                res.data.emergingGroups.find(_ => _.key == 1).conditionDtos
                        }
                    }
                    else if (this.selectedCategory.code == "02") {

                        let level2 = res.data.emergingGroups.find(_ => _.key == 2)
                        if (level2)
                            this.techHighLevel2s = level2.conditionDtos
                        else {
                            this.techHighLevel2s = []
                        }
                    }
                    else if (this.selectedCategory.code == "03") {
                        if (!this.demandTypeVisble && this.selectDemandHighTechs.length == 0) {
                            this.demandHighTechs =
                                res.data.emergingGroups.find(_ => _.key == 1).conditionDtos
                        }
                    }
                }
                else {
                    if (this.selectedCategory.code == "02") {
                        this.techHighLevel1Visible = true
                    }
                    if (this.selectedCategory.code == "03") {
                        this.demandTypeVisble = true
                    }
                }
            })
        },
        orderBy(orderBy, orderSeq, index) {
            if (orderBy == "BY_PRICE") {
                this.showPriceArray = !this.showPriceArray
                this.showPublishTimeArray = false
            } else if (orderBy == "BY_PUBLISH_TIME") {
                this.showPriceArray = false
                this.showPublishTimeArray = !this.showPublishTimeArray;
            } else {
                this.showPriceArray = false
                this.showPublishTimeArray = false
            }
            this.selectOrder = index
            this.page = 1
            this.orderParam = {
                orderBy: orderBy,
                orderSeq: orderSeq
            }
            this.search(this.getSearchParams(), this.orderParam);
        },
        filterChildType(childType) {
            if (childType == undefined) {
                return '';
            }
            if (childType.startsWith("01")) {
                return this.codes[0].childs.find(_ => _.code == childType).name;
            } else if (childType.startsWith("02")) {
                return this.codes[1].childs.find(_ => _.code == childType).name;
            } else return "";
        },
        filterTags(tags) {
            if (tags != null)
                return tags
                    .split(",")
                    .slice(0, 3)
                    .join(" ");
            else return "";
        },
        filterType(type) {
            if (type == null) return;
            if (type == "02") type = "00,01";
            return type.split(",");
        },
        getEmergingNames(item) {
            if (item.emergingNames.length <= 3)
                return item.emergingNames.join(' ')
            else
                return item.emergingNames.slice(0, 2).join(' ')
        },
        getEmergingName(item) {
            let names = item.emergingName.split(',')
            if (names <= 3)
                return names.join(' ')
            else
                return names.slice(0, 2).join(' ')
        },
        change(page) {
            this.page = page;
            this.search(this.getSearchParams(), this.orderParam);
        },
        getSearchParams() {
            var params = {
                page: this.page,
                rows: this.rows
            }
            if (this.keyword != "")
                params.keyword = this.keyword;
            if (this.selectedCategory != null && this.selectedCategory.code != "") {
                params.category = this.selectedCategory.category
                if (params.category == "goods") {
                    params.goodsType = this.selectedCategory.code
                }
            }
            if (this.selectedCategory.code == '01') {
                if (this.selectPatentType != null)
                    params.childType = this.selectPatentType.code
                if (this.selectedPatentHighLevel.length != 0) {
                    params.emergings = [{
                        codes: this.selectedPatentHighLevel.map(_ => { return _.key }),
                        level: 1
                    }]
                }
            }
            if (this.selectedCategory.code == '02') {
                if (this.selectedtechHighLevel1 != null) {
                    params.emergings = [{
                        codes: [this.selectedtechHighLevel1.key],
                        level: 1
                    }]
                }
                if (this.selectedtechHighLevel2.length != 0) {
                    params.emergings = [{
                        codes: this.selectedtechHighLevel2.map(_ => { return _.key }),
                        level: 2
                    }]
                }
            }
            if (this.selectedCategory.code == '03') {
                if (this.selectedDemandType != null) {
                    params.demandType = this.selectedDemandType.code
                }
                if (this.selectDemandHighTechs.length != 0) {
                    params.emergings = [{
                        codes: this.selectDemandHighTechs.map(_ => { return _.key }),
                        level: 1
                    }]
                }
            }
            return params;
        },
        getTopGoodsByHits() {
            portal.topGoodsImagesByHits({ query: { top: 5 } })
                .then(res => {
                    this.topGoods = res.data;
                });
        },
        getTopDemandsByHits() {
            portal.topDemandsByHits({ query: { top: 5 } }).then(res => {
                this.topDemands = res.data;
            });
        },
        getTopNewsByHits() {
            portal.getTopInformation({
                query: { num: 5 }
            }).then(res => {
                this.topNews = res.data;
            })
        },
        defaultImg(code) {
            if (code == '01') {
                return 'this.src="' + require(`~/assets/images/zhuanli.png`) + '"'
            }
            else if (code == '02') {
                return 'this.src="' + require(`~/assets/images/tech.png`) + '"'
            }
            else if (code == "03") {
                return 'this.src="' + require(`~/assets/images/demand.png`) + '"'
            }
            else {
                return 'this.src="' + require(`~/assets/images/no-img.png`) + '"'
            }
        }
    }
}
</script>

<style>
@import "~/assets/styles/search.css";
</style>
